<%--
  @author Kusal Samarakoon
  @author Supun Viraj Rathnayaka
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>

<script type="text/javascript">

    $(function(){
        $('.land-table').html(initTableHead());
    });

    function generateStaicstics(){
        var id;
        var mode;
        var type = "landAppStat";
        var from = $('input#startDate').val().split("-");
        var to  = $('input#endDate').val().split("-");
        var landStateId = $('select#applicationState').attr("value");
        var fromDate = new Date(from[0],(from[1]-1),from[2]).getTime();
        var toDate = new Date(to[0],(to[1]-1),to[2]).getTime();

        //alert("From : "+fromDate.toJSON()+" To : "+toDate.toJSON()+" State : "+landStateId);

       if($('select#dsDivisionId').attr("value")>0){
            id = $('select#dsDivisionId').attr("value");
            mode = "byDSDivision";
        }else if($('select#districtId').attr("value")>0){
            id=$('select#districtId').attr("value");
            mode = "byDistrict";
        }else{
            id =  $('select#provinceId').attr("value");
            mode = "byProvince";
        }

        $.getJSON('${pageContext.request.contextPath}/common/LandLookupService', {id:id, mode:mode, type:type, fromDate:fromDate, toDate:toDate, landAppState:landStateId}, function(data,status) {
            //alert(status);
           // alert(JSON.stringify(data));
            loadLandList(data.landList);
        });
    }

    function loadLandList(landInfo) {
        var opt = '';
        var total = 0;
        opt += initTableHead();
        opt += '<tbody>';

        if (landInfo.length > 0) {
            for (var i = 0; i < landInfo.length; i++) {
                opt += '<tr>' +
                        '<td class="center-align">' + landInfo[i][0] + '</td>' +
                        '<td class="center-align">' + landInfo[i][1] + '</td>' +
                        '</tr>';
                total +=landInfo[i][1];
            }
        }else{
            opt+='<tr>'+
                    '<td colspan="7" class="center-align">' +
                    $('#no-record').val() +
                    '</td>' +
                    '</tr>';
        }


        opt += '</tbody>';
        if(landInfo.length > 1){
            opt+= initTableFoot(total);
        }
        $('.land-table').html(opt);
        //setDataTable();
    }

    function initTableHead(){
        var opt = '';
        opt += '<thead>' +
                '<tr class="table-header">' +
                '<th class="center-align">' + $('#application_status').val() + '</th>' +
                '<th class="center-align">' + $('#no_of_applications').val() + '</th>' +
                '</tr>' +
                '</thead>';
        return opt;
    }

    function initTableFoot(total){
        var opt = '';
        opt += '<tfoot>' +
                '<tr class="table-header">' +
                '<th class="center-align">' + $('#all_applications_sum').val() + '</th>' +
                '<th class="center-align">' + total + '</th>' +
                '</tr>' +
                '</tfoot>';
        return opt;
    }


    $(function() {
        $('select#provinceId').bind('change', function(evt1) {
            var id = $("select#provinceId").attr("value");
            $.getJSON('${pageContext.request.contextPath}/common/DivisionLookupService', {id:id,mode:1},
                    function(data) {
                        var options1 = '<option value="0">' + $('#all').val()  + '</option> ';
                        var ds = data.districtsList;
                        for (var i = 0; i < ds.length; i++) {
                            options1 += '<option value="' + ds[i].optionValue + '">' + ds[i].optionDisplay + '</option>'

                        }
                        $("select#districtId").html(options1);
                        var options2 = '<option value="0">' + $('#all').val()  + '</option> ';
                        $("select#dsDivisionId").html(options2);
                    });
        });

    });

    $(function() {
        $('select#districtId').bind('change', function(evt1) {
            var id = $("select#districtId").attr("value");
            $.getJSON('${pageContext.request.contextPath}/common/DivisionLookupService', {id:id,mode:2},
                    function(data) {
                        var options1 = '<option value="0">' + $('#all').val()  + '</option> ';
                        var ds = data.dsDivisionList;
                        for (var i = 0; i < ds.length; i++) {
                            options1 += '<option value="' + ds[i].optionValue + '">' + ds[i].optionDisplay + '</option>'

                        }
                        $("select#dsDivisionId").html(options1);
                    });
        });
    });

</script>

<div id="application-stat-module-home-title" class="module-home-title">
    <s:a href="home.do"><img src="${pageContext.request.contextPath}/images/home.png"
                             alt="Home"><span><s:label
            value="%{getText('home.label')}"/></span></s:a>
    <span class="module-title-breaker"> > </span>
    <s:a href="statisticsModule.do"><img src="${pageContext.request.contextPath}/images/stat.png"
                                         alt="View Statistics"><span><s:label
            value="%{getText('statisticsModule.label')}"/></span></s:a>
    <span class="module-title-breaker"> > </span>
    <s:a href="applicationStat.do"><img src="${pageContext.request.contextPath}/images/stat.png"
                                        alt="View Application Statistics"><span><s:label
            value="%{getText('applicationStat.label')}"/></span></s:a>
    <div id="back-button" align="right">
              <s:form><s:submit value="%{getText('back_btn.label')}" action="statisticsModule"/></s:form>
    </div>
</div>

<table>
    <tr>
        <td colspan="2" class="left-align">
            <div class="action-msg"><s:actionmessage/></div>
            <div class="action-err"><s:actionerror/></div>
        </td>
    </tr>
</table>
<div id="application-stat-module-home" class="module-home">

    <h2><s:label value="%{getText('land_application_statistics.label')}"/></h2>

    <table>
        <tr>
            <td class="left-align">
                <s:label value="%{getText('time_range.label')}"/>
            </td>
            <td class="left-align">
                <s:textfield cssClass="width-200-px" id="startDate" name="startDate" onclick="selectDate('startDate')"
                             onKeyPress="return dateNumbersOnly(event,true)"/>
            </td>
            <td class="left-align">
                <s:label value="%{getText('from.label')}"/>
            </td>
            <td class="left-align">
                <s:textfield cssClass="width-200-px" id="endDate" name="endDate" onclick="selectDate('endDate')"
                             onKeyPress="return dateNumbersOnly(event,true)" />
            </td>
            <td class="left-align">
                <s:label value="%{getText('to.label')}"/>
            </td>
        </tr>
        <tr>
            <td><s:label value="%{getText('application_status.label')}"/></td>
            <td colspan="4"><s:select id="applicationState" name="applicationStateId" list="landApplicationStateList" headerKey="0" headerValue="%{getText('all.label')}"/></td>
        </tr>
        <tr>
            <td></td>
            <td colspan="2"><s:label value="%{getText('province.label')}"/></td>
            <td colspan="2"><s:label value="%{getText('district.label')}"/></td>
        </tr>
        <tr>
            <td></td>
            <td colspan="2" class="center-align">
                <s:if test="%{provinceList.size==1}">
                    <s:select id="provinceId" name="provinceId" list="provinceList" cssClass="width-250-px"/>
                </s:if>
                <s:else>
                    <s:select id="provinceId" name="provinceId" list="provinceList" headerKey="0"
                              headerValue="%{getText('all.label')}" cssClass="width-250-px"/>
                </s:else></td>
            <td colspan="2" class="center-align">
                <s:if test="%{districtList.size==1}">
                    <s:select id="districtId" name="districtName" list="districtList" cssClass="width-250-px"/>
                </s:if>
                <s:else>
                    <s:select id="districtId" name="districtName" list="districtList" headerKey="0"
                              headerValue="%{getText('all.label')}" cssClass="width-250-px"/>
                </s:else></td>
        </tr>
        <tr>
            <td></td>
            <td colspan="4"><s:label value="%{getText('ds_division.label')}"/></td>
            <%--<td colspan="2"><s:label value="%{getText('gn_division.label')}"/></td>--%>
        </tr>
        <tr>
            <td></td>
            <td colspan="2" class="center-align">
                <s:if test="%{dsDivisionList.size==1}">
                    <s:select id="dsDivisionId" name="dsDivisionId" list="dsDivisionList" cssClass="width-250-px"/>
                </s:if>
                <s:else>
                    <s:select id="dsDivisionId" name="dsDivisionId" list="dsDivisionList" headerKey="0"
                              headerValue="%{getText('all.label')}" cssClass="width-250-px"/>
                </s:else></td>
            <td colspan="2" class="right-align">
                <s:submit onClick="generateStaicstics()" value="%{getText('search.label')}"/></td>
        </tr>
        <%--<tr>
            <td colspan="5" class="right-align"></td>
        </tr>--%>
        </table>


        <table class="width-100 margin-10-auto table land-table">
        </table>

        <%-- Localization text for data tables --%>
        <s:hidden id="display" value="%{getText('display.label')}"/>
        <s:hidden id="records" value="%{getText('records.label')}"/>
        <s:hidden id="search" value="%{getText('search.label')}"/>
        <s:hidden id="no-record" value="%{getText('no_record.label')}"/>
        <s:hidden id="showing" value="%{getText('showing.label')}"/>
        <s:hidden id="to" value="%{getText('to.label')}"/>
        <s:hidden id="of" value="%{getText('of.label')}"/>
        <s:hidden id="entries" value="%{getText('entries.label')}"/>
        <s:hidden id="first" value="%{getText('first.label')}"/>
        <s:hidden id="last" value="%{getText('last.label')}"/>
        <s:hidden id="next" value="%{getText('next.label')}"/>
        <s:hidden id="previous" value="%{getText('previous.label')}"/>
        <s:hidden id="all" value="%{getText('all.label')}"/>
        <s:hidden id="application_status" value="%{getText('application_status.label')}"/>
        <s:hidden id="no_of_applications" value="%{getText('number_of_applications.label')}"/>
        <s:hidden id="all_applications_sum" value="%{getText('all_applications_sum.label')}"/>


</div>